<%--
  Created by IntelliJ IDEA.
  User: 23649
  Date: 2021/5/11
  Time: 10:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>

    <%
        String paths = request.getContextPath();
        String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + paths + "/";
    %>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <style type="text/css">
        #head {
            width: 1100px;
            height: 350px;
            margin: auto;
            font-family: "方正大黑简体";
            color: #FFFFFF;
        }

        #tit > h3 {
            text-align: center;
        }

        #head span {
            margin-top: 50px;
            margin-left: 380px;
        }

        #office a {
            color: black;
            text-decoration: none;


        }

        .office-name span {
            font-family: "方正大黑简体";
            margin-left: 110px;
            line-height: 50px;

        }

        .office-name {
            border: 1px black solid;
            border-radius: 5px;
            width: 283px;
            height: 55px;
            display: inline-block;
            margin-right: 200px;
        }

        #office {
            margin-top: 30px;
            margin-left: 375px;
        }
    </style>
    <title>Title</title>
</head>
<body>
<div id="head" style="background-image: url('${pageContext.request.contextPath}/../static/img/guahao.png')">
    <div id="tit">
        <h3>患者服务</h3>
    </div>
    <div><span>用最真诚的服务态度，专业的药疗技术，为您服务</span></div>
</div>
<div id="office">
    <div class="office-name"><span><a id="huazi" name="华子科" href="javaScript:void(0)">华子科</a></span></div>
    <div class="office-name"><span><a id="guke" name="guke" href="javaScript:void(0)">骨科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">神经外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">普通外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">心外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">男科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">妇科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">手足外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">胸外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">肠胃外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">眼外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">耳外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">颈部外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">肛肠外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">肝胆外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">泌尿外科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">整形外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">皮肤科</a></span></div>
    <br>
    <div class="office-name"><span><a href="javaScript:void(0)">儿外科</a></span></div>
    <div class="office-name"><span><a href="javaScript:void(0)">血管科</a></span></div>
</div>
<img src="${pageContext.request.contextPath}/../static/img/dibu.jpg" style="width: 1425px; ">
<script src="${pageContext.request.contextPath}/static/jquery/jquery-1.12.4.js"></script>
<script type="text/javascript">
    $(function () {
        $(".office-name").mousemove(function () {
            $(this).css({"background": "#c5a268", "color": "#FFFFFF"});
        })
        $(".office-name").mouseout(function () {
            $(this).css({"background": "#FFFFFF", "color": "#000000"});
        })
        $("#huazi").click(function () {
            $(this).attr("href", "${pageContext.request.contextPath}/type?opr=huazi");
        })
        $("#guke").click(function () {
            $(this).attr("href", "${pageContext.request.contextPath}/type?opr=guke");
        })
    })
</script>
</body>
</html>
